﻿@{
    ViewBag.Title = "Huoban";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no" />

    <title>我的朋友</title>
    <link href="/css/style.css" rel="stylesheet" />
    @*<link href="/user/css/swipper.css" rel="stylesheet" />*@
    @*<link href="/css/preload.css" rel="stylesheet" />
        <link href="/css/loading.css" rel="stylesheet" />*@
    <script src="~/js/jquery-1.7.2.min.js"></script>
    <script>
        var deviceWidth = document.documentElement.clientWidth;
        if (deviceWidth > 750) deviceWidth = 750;
        document.documentElement.style.fontSize = deviceWidth / 7.5 + "px";
        document.documentElement.style.width = "100%";
    </script>
</head>
<body>
    <div id="containter" class="container">

        <div class="ordernav">
            <a href="#" data-type="1" class="cur"><span>我的朋友</span></a>
            <a href="#" data-type="2"><span>朋友的朋友</span></a>        <a href="/integral/my"><span>我的欢乐豆</span></a>
            <a href="/integral/IntegralRanking"><span>欢乐豆排行榜</span></a>
        </div>


        <style>
            .usertx {
                width: 7.5rem;
                display: -webkit-box;
                height: 45px;
                line-height: 45px;
                -webkit-box-align: center;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                padding: 0 0.2rem;
                border-bottom: 1px solid #f0f0f0;
                font-size: 14px;
                position: relative;
                width: 100%;
            }

                .usertx span {
                    display: block;
                    color: #888;
                }

                .usertx .userpointer {
                    position: absolute;
                    color: #444;
                    font-size: 16px;
                    left: 15px;
                }

            .usergotx {
                position: absolute;
                right: 20px;
            }
        </style>
        <div class="allorder">
            <ul id="lists">
               
            </ul>

            <div id="list_more">
                <div class="nocoll">
                    <p>您还没有队员哦！~</p>
                </div>
            </div>
            @*<div class="nocoll">
                <p>您还没有队员哦！~</p>
            </div>

            <div class="usertx"><span class="userpointer"><img src="http://wx.qlogo.cn/mmopen/QAm7hEbaujRI9jichXwzeX9knWsUvLDN5PpGLcAYZMBiacU3yLibqdNsSTkFqvKluQZckH3HO8icsFFLQKyVkhxibPp4iavIfLJhD9/132" style="width: 40px; height: 40px; border-radius: 50%;">&nbsp;&nbsp;&nbsp;Bingo</span><span class="usergotx"> 658.00 </span></div>*@




        </div>
        <style>
            .usertx {
                height: 60px;
                line-height: 60px;
            }
        </style>

    </div>
    <script>
        var type = 1;
        $(function () {

            get_list(1);
            $('[data-type]').click(function () {
                type = $(this).attr('data-type');
                $('[data-type]').removeClass('cur');
                $(this).addClass('cur');

                get_list(1);
            })

        })
        var limit = 1;
        function get_list(ty) {

            if (ty == 1) {
                $("#lists").html('');
                limit = 1;
            } else {
                //$("#lists").html('<div class="dropload-refresh"  onclick="get_list(0);">卖命加载中...</div>');
            }

            $.ajax({
                type: "post",
                url: "/agent/GetHuoBan",
                data: {
                    type: type,limit:limit
                },
                dataType: "json",
                success: function (data) {

                    if (data.State == true) {
                        var list = data.Datas;
                        var content = '';
                        for (var i = 0; i < list.length; i++) {

                            content += '<div class="usertx">';
                            content += ' <span class="userpointer">';
                            content += ' <img src="' + list[i].head_img + '" style="width: 40px; height: 40px; border-radius: 50%;">';
                            content += '  &nbsp;&nbsp;&nbsp;' + list[i].nickname;
                            content += ' </span><span class="usergotx">  </span></div>';



                        }
                        $("#lists").append(content);

                      
                        if (list.length > 1) {
                            $("#list_more").html('<div class="nocoll"><p>加载中</p></div>');
                        } else {
                            $("#list_more").html('<div class="nocoll"><p>没有更多记录！~</p></div>');
                        }
                        limit++;




                        //waterfall();
                        //lazy_img();
                    } else {
                        $("#list_more").html('<div class="nocoll"><p>您还没有队员哦！~</p></div>');
                        //dialog("没有更多记录！！");
                        //$("#list_more").fadeOut(500);
                    }
                },
                error: function (xhr, type) {

                }
            });


        }
        ////==============自动加载=============
        //获取滚动条当前的位置
        function getScrollTop() {
            var scrollTop = 0;
            if (document.documentElement && document.documentElement.scrollTop) {
                scrollTop = document.documentElement.scrollTop;
            }
            else if (document.body) {
                scrollTop = document.body.scrollTop;
            }
            return scrollTop;
        }

        //获取当前可是范围的高度
        function getClientHeight() {
            var clientHeight = 0;
            if (document.body.clientHeight && document.documentElement.clientHeight) {
                clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
            }
            else {
                clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
            }
            return clientHeight;
        }

        //获取文档完整的高度
        function getScrollHeight() {
            return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
        }


        $(window).scroll(function () {
            if (getScrollTop() + getClientHeight() == getScrollHeight()) {
                //alert("到达底部");
                get_list(0);
            }
        });

        //==============自动加载=============


    </script>

</body>
</html>

